<!--案件受理, 受理中心-->
<template>
  <div>
    <tablePage ref="tablePage" canFold :searchForm.sync="searchForm" :searchFormRules="searchFormRules" :requestFunc="requestFunc">
      <template slot="search-form">
        <searchFormItemsCommon :statusArr="statusArr" :form.sync="searchForm" :rules.sync="searchFormRules"></searchFormItemsCommon>
      </template>
      <template slot="left">
        <el-button @click="handleShowAddWorkOrderDialog" type="primary" icon="img icon-add">创建案件</el-button>
      </template>

      <template slot="rows">
        <tableColumnsCommon fixed="right" type="accepted" @showDetailsDialog="handleShowDialog('detailsDialog', $event)" @showLeaveMessageDialog="handleShowDialog('leaveMessageDialog', $event)"></tableColumnsCommon>
      </template>
    </tablePage>

    <!-- 详情弹窗-->
    <detailsDialog ref="detailsDialog" type="distribute" :visible.sync="detailsDialog.visible" :id="currentRow.id" @read="handleReadComment">
      <template v-slot:footer-btn="{ details, workOrderPermission }">
        <!-- TODO -->
        <!-- <template v-if="[16].includes(details.status)">
          <el-button @click="onCheckTongguo(details)" type="primary">复核通过</el-button>
          <el-button @click="reviewFailed.visible = true" type="primary">复核不通过</el-button>
        </template> -->
        <!-- 撤回中 -->
        <template v-if="[9].includes(details.status)">
          <el-button @click="handleRecallApprove(0)" type="primary">同意撤回</el-button>
          <el-button @click="handleRecallApprove(1)" type="primary" plain>不同意撤回</el-button>
        </template>
        <template v-else-if="details.auditFlag === 'N' && details.materialCorrectStatus !== 0">
          <!-- 待受理 回退中 不受理-->
          <el-button v-permission="['允许编辑案件']" v-if="[0, 1, 6].includes(details.status)" @click="handleShowEditWorkOrderDialog(details)" type="primary" plain>编辑</el-button>
          <!-- 待确认 -->
          <!-- v-permission="['允许取消受理']"  -->
          <template v-if="[2].includes(details.status)">
            <div class="feedback-control">
              <div class="control-item">
                <div class="control-label">允许复核：</div>
                <el-switch active-color="#2b65da" :width="50" v-model="workOrderPermission.repeatCheckPermission" inactive-value="0" active-value="1" @change="handleUpdateRepeatCheckPermission($event, details)"></el-switch>
              </div>
              <div class="control-item">
                <div class="control-label">允许退回：</div>
                <el-switch active-color="#2b65da" :width="50" v-model="workOrderPermission.returnPermission" inactive-value="0" active-value="1" @change="handleUpdateReturnPermission($event, details)"></el-switch>
              </div>
            </div>
            <el-button @click="cancelAcceptDialog.visible = true" type="primary">撤回</el-button>
          </template>

          <!-- 待受理 回退中 -->
          <!-- <template v-if="[0, 1].includes(details.status)"> -->
          <!-- 待受理 -->
          <template v-if="[0].includes(details.status)">
            <!-- <el-button @click="acceptAndTransferDialog.visible = true" type="primary">受理</el-button> -->
            <el-button @click="acceptDialog.visible = true" type="primary">受理</el-button>
            <el-button @click="notAcceptDialog.visible = true" type="primary" plain>不受理</el-button>
            <!-- <el-button @click="transferDialog.visible = true" type="primary">移交</el-button> -->
          </template>
          <template v-if="[21].includes(details.status)">
            <el-button @click="acceptAndTransferDialog.visible = true" type="primary">案件派发</el-button>
          </template>
        </template>
      </template>
    </detailsDialog>

    <!-- 留言评论弹窗-->
    <leaveMessageDialog :visible.sync="leaveMessageDialog.visible" :workOrderNo="currentRow.workOrderNo" :id="currentRow.id" canDelete @read="handleReadLeaveMessage"></leaveMessageDialog>

    <!-- 编辑弹窗-->
    <createWorkOrderDialog :visible.sync="createWorkOrderDialog.visible" :isEdit="createWorkOrderDialog.isEdit" :details="createWorkOrderDialog.details" @success="handleAddWorkOrderSuccess"></createWorkOrderDialog>

    <!-- 不受理案件-->
    <notAcceptDialog :visible.sync="notAcceptDialog.visible" @success="rePlayLoadData" :workOrderNo="currentRow.workOrderNo"></notAcceptDialog>

    <!-- 案件受理 -->
    <acceptDialog :visible.sync="acceptDialog.visible" @success="rePlayLoadData" :workOrderNo="currentRow.workOrderNo"></acceptDialog>

    <!-- 取消受理 改成 撤回-->
    <cancelAcceptDialog :visible.sync="cancelAcceptDialog.visible" @success="rePlayLoadData" :workOrderNo="currentRow.workOrderNo"></cancelAcceptDialog>

    <!-- 移交案件-->
    <transferDialog :visible.sync="transferDialog.visible" @success="handleTransferSuccess" :workOrderNo="currentRow.workOrderNo"></transferDialog>

    <!-- 受理办交案件 -> 自办/转办-->
    <acceptAndTransferDialog :visible.sync="acceptAndTransferDialog.visible" @success="rePlayLoadData" :workOrderNo="currentRow.workOrderNo"></acceptAndTransferDialog>

    <!-- 转移交办-->
    <transferAndAcceptDialog :visible.sync="transferAndAcceptDialog.visible" @success="rePlayLoadData" :workOrderNo="currentRow.workOrderNo"></transferAndAcceptDialog>

    <!-- 中止 -->
    <suspendDialog type="distribute" :visible.sync="suspendDialog.visible" :workOrderNo="currentRow.workOrderNo" @success="rePlayLoadData"></suspendDialog>
    <!-- 延期 -->
    <postponeDialog type="distribute" :visible.sync="postponeDialog.visible" :workOrderNo="currentRow.workOrderNo" @success="rePlayLoadData"></postponeDialog>
    <!-- 办结 -->
    <finallyDialog :visible.sync="finallyDialog.visible" :workOrderNo="currentRow.workOrderNo" @success="rePlayLoadData"></finallyDialog>

    <!-- 退回 -->
    <!-- <backDialog :visible.sync="backDialog.visible" :workOrderNo="currentRow.workOrderNo" @success="rePlayLoadData"></backDialog> -->

    <!-- 取消办结 -->
    <cancelFinallyDialog :visible.sync="cancelFinallyDialog.visible" :workOrderNo="currentRow.workOrderNo" @success="rePlayLoadData"></cancelFinallyDialog>

    <!-- 复核不通过 -->
    <review-failed :visible.sync="reviewFailed.visible" :workOrderNo="currentRow.workOrderNo" @success="rePlayLoadData"></review-failed>
  </div>
</template>

<script>
import tablePage from "@/components/tablePage/index.vue";
import searchFormItemsCommon from "@/views/workOrder/components/searchFormItemsCommon/searchFormItemsCommon";
import tableColumnsCommon from "@/views/workOrder/components/tableColumnsCommon";
import detailsDialog from "./components/detailsDialog.vue";
import leaveMessageDialog from "./components/leaveMessageDialog";
import createWorkOrderDialog from "./components/createWorkOrderDialog";
import notAcceptDialog from "./components/notAcceptDialog";
import acceptDialog from "./components/acceptDialog";
import cancelAcceptDialog from "./components/cancelAcceptDialog";
import transferDialog from "./components/transferDialog";
import acceptAndTransferDialog from "./components/acceptAndTransferDialog";
import suspendDialog from "./components/suspendDialog";
import postponeDialog from "./components/postponeDialog";
import finallyDialog from "./components/finallyDialog";
// import backDialog from "./components/backDialog";
import cancelFinallyDialog from "./components/cancelFinallyDialog";
import transferAndAcceptDialog from "./components/transferAndAcceptDialog";

import { defaultSearchFromForURLQueryMixin, initSearchForm, initSearchFormRules } from "@/views/workOrder/components/searchFormItemsCommon/mixin";
import * as workOrderApi from "@/api/workOrder/index";
import { workOrderStatus, timeRemaining, workOrderPublicStatus } from "@/utils/filters";
import * as mixins from "@/utils/mixins";
import { checkPermission, generateWorkOrderStatusArr } from "@/utils/common";
import reviewFailed from "./components/reviewFailed.vue";

export default {
  name: "accepted",
  mixins: [mixins.affirm, defaultSearchFromForURLQueryMixin],
  components: {
    tablePage,
    searchFormItemsCommon,
    tableColumnsCommon,
    // backDialog,
    cancelFinallyDialog,
    transferAndAcceptDialog,
    finallyDialog,
    detailsDialog,
    leaveMessageDialog,
    createWorkOrderDialog,
    notAcceptDialog,
    transferDialog,
    acceptDialog,
    acceptAndTransferDialog,
    cancelAcceptDialog,
    suspendDialog,
    postponeDialog,
    reviewFailed,
  },
  filters: { workOrderStatus, timeRemaining, workOrderPublicStatus },
  data() {
    const statusArr = generateWorkOrderStatusArr(
      [
        { id: "12", name: "预审中" },
        { id: "0", name: "待受理" },
        { id: "2", name: "待确认" },
        { id: "1", name: "回退中" },
        // { id: "4", name: "待办结" },
        { id: "9", name: "撤回中" },
        { id: "6", name: "不受理" },
        { id: "14", name: "放弃投诉" },
        { id: "16", name: "待复核" },
        { id: "10", name: "已撤回" },
        { id: "21", name: "待派发" },
      ],
      [
        [checkPermission(["允许取消受理"]), { id: "2", name: "待确认" }],
        [checkPermission(["允许取消办结"]), { id: "5", name: "已办结" }],
        [checkPermission(["允许取消不受理"]), { id: "6", name: "不受理" }],
      ]
    );
    return {
      searchForm: initSearchForm({ status: statusArr[0].id }),
      searchFormRules: initSearchFormRules(),
      currentRow: {},
      detailsDialog: {
        editDetails: {},
        visible: false,
      },
      leaveMessageDialog: {
        visible: false,
      },
      createWorkOrderDialog: {
        details: {},
        isEdit: false,
        visible: false,
      },
      notAcceptDialog: { visible: false },
      transferDialog: { visible: false },
      acceptDialog: { visible: false },
      acceptAndTransferDialog: { visible: false },
      cancelAcceptDialog: { visible: false },
      suspendDialog: { visible: false },
      postponeDialog: { visible: false },
      finallyDialog: { visible: false },
      backDialog: { visible: false },
      cancelFinallyDialog: { visible: false },
      transferAndAcceptDialog: { visible: false },
      reviewFailed: { visible: false },
      statusArr: statusArr,
    };
  },
  methods: {
    requestFunc: workOrderApi.distribute.list,
    handleShowDialog(type, row) {
      this[type].visible = true;
      if (row) {
        this.currentRow = row;
      }
    },
    handleReadComment() {
      // this.currentRow.appraiseFlag = 'N'
    },
    handleReadLeaveMessage() {
      this.currentRow.wordsFlag = "N";
    },
    handleShowAddWorkOrderDialog() {
      const dialog = "createWorkOrderDialog";
      this[dialog].details = {};
      this[dialog].isEdit = false;
      this.handleShowDialog(dialog);
    },
    handleShowEditWorkOrderDialog(details) {
      const dialog = "createWorkOrderDialog";
      this[dialog].details = { ...details };
      this[dialog].isEdit = true;
      this.handleShowDialog(dialog);
    },
    rePlayLoadData() {
      this.$refs.tablePage.playLoadData();
      if (this.detailsDialog.visible) {
        this.$refs.detailsDialog.playLoadData();
      }
    },
    rePlayLoadDetailsData() {
      this.$refs.detailsDialog.playLoadData();
    },
    // 添加、编辑案件成功
    handleAddWorkOrderSuccess() {
      this.rePlayLoadData();
    },
    // 取消受理成功
    handleNotAcceptSuccess() {
      this.rePlayLoadData();
    },
    // 移交成功
    handleTransferSuccess() {
      this.detailsDialog.visible = false;
      this.rePlayLoadData();
    },
    // 受理办交成功
    handleAcceptAndTransferSuccess() {
      // TODO
    },
    // 取消不受理
    handleCancelNoAccept() {
      this.confirm("确定取消不受理吗？")
        .then((res) => workOrderApi.distribute.cancelReject(this.currentRow.workOrderNo))
        .then(() => this.rePlayLoadData());
    },

    // 取消终止
    handleCancelOver() {
      this.confirm("确定取消终止吗？")
        .then((res) => workOrderApi.process.cancelOver(this.currentRow.workOrderNo))
        .then(() => this.rePlayLoadData());
    },

    // 撤回工单审批
    handleRecallApprove(status) {
      this.confirm("确定提交吗？")
        .then(() =>
          workOrderApi.distribute.recallApprove({
            status,
            workOrderId: this.currentRow.id,
          })
        )
        .then(() => this.rePlayLoadData());
    },
    // 复核通过
    onCheckTongguo({ workOrderNo }) {
      this.confirm("确定通过复核申请吗？")
        .then(() =>
          workOrderApi.process.doRepeatCheck({
            isPass: 1, // 复核是否通过 0 不通过 1 通过
            workOrderNo: workOrderNo,
          })
        )
        .then(() => this.rePlayLoadData());
    },
    // 复核和退回权限修改
    handleUpdateRepeatCheckPermission(e, { workOrderNo, id }) {
      this.confirm(`确定${e === 1 ? "开启" : "关闭"}允许复核吗？`)
        .then((r) =>
          workOrderApi.distribute.saveWorkOrderPermission({
            repeatCheckPermission: e,
            workOrderNo: workOrderNo,
            workOrderId: id,
          })
        )
        .then(() => this.$refs.detailsDialog.getWorkOrderPermission())
        .catch(() => this.$refs.detailsDialog.getWorkOrderPermission());
    },
    handleUpdateReturnPermission(e, { workOrderNo, id }) {
      this.confirm(`确定${e === 1 ? "开启" : "关闭"}允许退回吗？`)
        .then((r) =>
          workOrderApi.distribute.saveWorkOrderPermission({
            returnPermission: e,
            workOrderNo: workOrderNo,
            workOrderId: id,
          })
        )
        .then(() => this.$refs.detailsDialog.getWorkOrderPermission())
        .catch(() => this.$refs.detailsDialog.getWorkOrderPermission());
    },
  },
};
</script>

<style scoped lang="less">
.feedback-control {
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
  display: flex;
  .control-item {
    display: flex;
    align-items: center;
    margin-left: 20px;
    .control-label {
      color: #333;
    }
  }
}
</style>
